<template>
  <view class="Login-page">
    <image
      mode="aspectFill"
      src="https://diancan-1252107261.cos.accelerate.myqcloud.com/yiliao/denglu-yemian.jpg"
    ></image>
    <button @click="Login">微信登录</button>
  </view>
</template>

<script setup>
import { ref } from "vue";
import apiRequest from "~/api/index";
const nickName = ref();
const avatarUrl = ref();

// 登陆事件
const Login = () => {
  uni.getUserProfile({
    desc: "用于举例",
    success: (Fres) => {
      nickName.value = Fres.userInfo.nickName;
      avatarUrl.value = Fres.userInfo.avatarUrl;
      uni.login({
        success: (res) => {
          uni.showLoading({ title: "登录中", mask: true });
          ApiLogin(res.code);
        },
      });
    },
    fail: (err) => {
      console.log(err);
    },
  });
};
// API登录
const ApiLogin = async (code) => {
  let data = {
    appid: "wxe5f43a59191d090c",
    secret: "556181ea074a7278716ea51f1b032396",
    avatarUrl: avatarUrl.value,
    nickName: nickName.value,
    code,
  };
  const res = await apiRequest.WxLogin(data).catch((err) => {
    console.log("登陆失败", err);
  });
  // 存储用户信息到本地缓存，然后返回上一页
  if (res.msg == "SUCCESS") {
    console.log(res);
    uni.setStorageSync("userInfo", res.data);
    uni.navigateBack({ delta: 1 });
    uni.hideLoading();
  } else {
    uni.showToast({
      title: "登陆失败",
      duration: 2000,
    });
  }
};
// const Login = () => {
//   const BasicToken =
//     "Basic ZXlKaGJHY2lPaUpJVXpJMU5pSXNJblI1Y0NJNklrcFhWQ0o5LmV5SjFhV1FpT2lKdmJXNWxWRFZGVWsxdmEwRkpOVUZRVUVVd1VqRlpTRlJVZURnMElpd2ljMk52Y0dVaU9qSXNJbWxoZENJNk1UWTNNRGs0T0RVME15d2laWGh3SWpveE5qY3hNalEzTnpRemZRLjdoQ050aTloQmFaYWVPclhuS3pSZkJGeTcyUG5hTXV6ZEdDZGZmTWJQZUU6";
//   uni.setStorageSync("token", BasicToken);
//   uni.navigateBack({ delta: 1 });
//   // uni.hideLoading();
// };
</script>

<style scoped>
.Login-page {
  position: relative;
  height: 100vh;
}
image {
  width: 100%;
  height: 100%;
}
button {
  padding: 0 60rpx;
  background: rgb(4, 193, 95);
  color: #fff;
  position: absolute;
  left: 50%;
  bottom: 30%;
  transform: translate(-50%, -50%);
}
</style>
